import React from 'react'
import Taro from '@tarojs/taro'
import { View , Text} from '@tarojs/components'
import { AtDivider, AtAvatar, AtButton } from "taro-ui"

import './SingleOrder.scss';
import {api_checkOrderTime} from '../../../utils/api.jsx'

class NoPayOrder extends React.Component{

  // checkOutOfTime = async () => {
  //   const params = {
  //     url: api_checkOrderTime,
  //     cache:'reload',
  //     data: {
  //       order_id:this.props.order_id
  //     },
  //     method: 'POST',
  //     header: {
  //       'content-type': 'application/x-www-form-urlencoded' // 默认值
  //     },
  //     success: (res) => {Taro.setStorageSync('isOutOfTime',res.data)},
  //     fail: (res) => {console.log(res.data)}
  //   }
  //   Taro.request(params)
  //   const isOutOfTime = Taro.getStorageSync('isOutOfTime')
  //   if(isOutOfTime){
  //     Taro.showToast({
  //       title: '超过15分钟未支付，已自动取消！',
  //       icon: 'none',
  //       duration: 2000
  //     })
  //   }else{
  //     Taro.navigateTo({url: '/pages/pagesB/payMoney/payMoney'})
  //   }
  // }

  // 跳转支付
  payMoney = () => {
    const page = '/pages/pagesA/pay/pay?order_id='+this.props.order_id
    +'&doctor_name='+this.props.doctor_name+'&fee='+this.props.order_fee+'&department='+this.props.department
    Taro.navigateTo({url: page})
  }

  render(){
      return(
        <View className='singleOrder'>
          <AtDivider lineColor='#ddd' height='35' />
          <view className='hospital'>
            <Text>{this.props.hospital_name}</Text>
          </view>
          <AtDivider lineColor='#f6f6f6' height='35' />
          <view className='orderInfo'>
            <view className='doctorAvatar'>
              <AtAvatar circle Text='头像' image={this.props.doctor_avatar}></AtAvatar>
            </view>
            <view className='orderBasicInfo'>
              <view className='department'>
                <text className='departmentText'>科室：</text>
                {this.props.department}
              </view>
              <view className='doctor'>
                <text className='doctorText'>预约医师：</text>
                {this.props.doctor_name}
              </view>
              <view className='orderTime'>
                <text className='orderText'>订单时间：</text>
                {this.props.order_time}
              </view>
              <view className='startTime'>
                <text className='startText'>预约时间：</text>
                {this.props.start_time}
              </view>
            </view>
            <view className='orderFee'>
              <text>{this.props.order_fee}元</text>
            </view>
            <AtButton size='small' className='payBtn' onClick={this.payMoney}>
                去支付
            </AtButton>
          </view>
          {/* <AtDivider lineColor='#ddd' height='35' /> */}
        </View>
      )
    }
}
  
export {NoPayOrder}